<?php
$porPaginas = $this->porPaginas;
$porDatas = $this->porDatas;
$mes = $this->mes;
$ano = $this->ano;

$total = count($porDatas)-1;

setlocale(LC_TIME, array("ptb", "pt_BR", "pt_BR.utf8"));
foreach ($porDatas as $i => $r) {
	$virgula = '';
	if ($i < $total) {
		$virgula = ',';
	}
	
	$datas .= "'" . utf8_encode(strftime("%A, %d de %B de %Y", strtotime($r->getDate()))) . "'$virgula";
	$dadosDatas  .= $r->getVisits() . $virgula;
}

$this->headScript()->appendFile($this->baseUrl('_js/highcharts/highcharts.js'));
$this->headScript()->appendFile($this->baseUrl('_js/highcharts/modules/exporting.js'));
?>
<script type="text/javascript">
var chartPaginas;
var chartDatas;
$(function() {
	chartPaginas = new Highcharts.Chart({
		chart: {
			renderTo: 'container',
			plotBackgroundColor: null,
			plotBorderWidth: null,
			plotShadow: false
		},
		title: {
			text: 'Paginas mais acessadas'
		},
		tooltip: {
			formatter: function() {
				return '<b>'+ this.point.name +'</b>: ' + this.y + ' (' + this.percentage.toPrecision(3) +' %)';
			}
		},
		plotOptions: {
			pie: {
				allowPointSelect: true,
				cursor: 'pointer',
				dataLabels: {
					enabled: true
				},
				showInLegend: true
			}
		},
		credits: {
			enabled: false
		},
	    series: [{
			type: 'pie',
			name: 'Paginas mais acessadas',
			data: [
<?php
//$total = $ga->getPageviews() / 100;
$outros = 0;
foreach($porPaginas as $i => $r) {
	if ($i < 10) {
?>
			    ['<?php echo $r;?>', <?php echo $r->getPageviews();?>],
<?php
	}
	else {
		$outros += $r->getPageviews();
	}
}
if ($outros > 0) {
?>
			    ['Outros', <?php echo $outros;?>]
<?php
}
?>
			]
		}]
	});
	
	// Grafico de visitas por data
	chartDatas = new Highcharts.Chart({
		chart: {
			renderTo: 'container2',
			defaultSeriesType: 'spline'
		},
		title: {
			text: 'Visitas por data nos ultimos 30 dias'
		},
		xAxis: {
			categories: [<?php echo $datas;?>],
			labels: {
				formatter: function() {
					return this.value.split(' ')[1];
				}
			}
		},
		yAxis: {
			min: 0,
			title: {
				text: 'No. de visitas',
				align: 'high'
			}
		},
		credits: {
			enabled: false
		},
	        series: [{
			name: 'Visitas',
			data: [<?php echo $dadosDatas;?>]
		}]
	});
	
});
</script>
<div class="graficosGoogleAnalytics">
    <form method="post" action="">
    	<div>Filtro:&nbsp;
    		<select name="mes">
    			<option <?php echo ($mes == '01') ? 'selected="selected"' : null;?> value="01">Janeiro</option>
    			<option <?php echo ($mes == '02') ? 'selected="selected"' : null;?> value="02">Fevereiro</option>
    			<option <?php echo ($mes == '03') ? 'selected="selected"' : null;?> value="03">Mar&ccedil;o</option>
    			<option <?php echo ($mes == '04') ? 'selected="selected"' : null;?> value="04">Abril</option>
    			<option <?php echo ($mes == '05') ? 'selected="selected"' : null;?> value="05">Maio</option>
    			<option <?php echo ($mes == '06') ? 'selected="selected"' : null;?> value="06">Junho</option>
    			<option <?php echo ($mes == '07') ? 'selected="selected"' : null;?> value="07">Julho</option>
    			<option <?php echo ($mes == '08') ? 'selected="selected"' : null;?> value="08">Agosto</option>
    			<option <?php echo ($mes == '09') ? 'selected="selected"' : null;?> value="09">Setembro</option>
    			<option <?php echo ($mes == '10') ? 'selected="selected"' : null;?> value="10">Outubro</option>
    			<option <?php echo ($mes == '11') ? 'selected="selected"' : null;?> value="11">Novembro</option>
    			<option <?php echo ($mes == '12') ? 'selected="selected"' : null;?> value="12">Dezembro</option>
    		</select>
    		<select name="ano">
<?php
$anosAtras = date('Y') - 4;
$anoAtual = date('Y');
for ($i = $anosAtras; $i <= $anoAtual; $i++) {
?>
				<option <?php echo ($i == $ano) ? 'selected="selected"' : null;?> value="<?php echo $i;?>"><?php echo $i;?></option>
<?php
}
?>
    		</select>
    		<input type="submit" value="ok" />
    	</div>
    </form>
	<div id="container" style="width: 100%; height: 400px"></div>
	<div style="clear: both;"></div>
	<div id="container2" style="width: 100%; height: 400px"></div>
</div>